<template>
  <!-- 团队信息-会员详情 -->
  <div class="detailMain">
    <!-- <div class="top-btns">
      <a-button type="primary" @click="backList"><a-icon type="rollback" />返回上一级</a-button>
      <a-button type="primary"><a-icon type="rollback" />返回服务商列表</a-button>
    </div> -->
    <div class="detail-content">
      <a-collapse v-model="activeKey">
        <a-collapse-panel header="服务商信息" key="1">
          <a-row :gutter="16">
            <a-col :span="8">
              <p>服务商账号：</p>
              <p>{{teamProviderData.partner_no}}</p>
            </a-col>
            <a-col :span="8">
              <p>服务商姓名：</p>
              <p>{{teamProviderData.partner_name}}</p>
            </a-col>
            <a-col :span="8">
              <p>服务商手机号：</p>
              <p>{{teamProviderData.partner_phone}}</p>
            </a-col>
            <a-col :span="8">
              <p>总收益：</p>
              <p>{{teamProviderData.partner_invite_member_income}}</p>
            </a-col>
            <a-col :span="8">
              <p>总数量：</p>
              <p>{{teamProviderData.partner_invite_member_num}}</p>
            </a-col>
            <a-col :span="8">
              <p>有效数量：</p>
              <p>{{teamProviderData.partner_invite_member_enable}}</p>
            </a-col>
            <a-col :span="8">
              <p>待审核数量：</p>
              <p>{{teamProviderData.partner_invite_member_no_verify}}</p>
            </a-col>
            <a-col :span="8">
              <p>无效数量：</p>
              <p>{{teamProviderData.partner_invite_member_no_valid}}</p>
            </a-col>
          </a-row>
        </a-collapse-panel>
        <a-collapse-panel header="邀请详情" key="2">
          <a-form class="search-form">
            <a-row :gutter="gutter">
              <a-col :lg="8" :xl="5" :xxl="4">
                <a-form-item label="账号状态">
                  <a-select v-model="enableType">
                    <a-select-option :value="0">全部</a-select-option>
                    <a-select-option :value="1">开启</a-select-option>
                    <a-select-option :value="2">关闭</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :lg="16" :xl="10" :xxl="8">
                <a-form-item label>
                  <a-input-group class="query-item" compact>
                    <a-select style="width: 30%" v-model="timeType">
                      <a-select-option :value="1">邀请时间</a-select-option>
                      <a-select-option :value="2">停用时间</a-select-option>
                    </a-select>
                    <date style="width: 70%" :value="time" @change="dateChange"/>
                  </a-input-group>
                </a-form-item>  
              </a-col>
              <a-col :lg="12" :xl="9" :xxl="7">
                <a-form-item label>
                  <a-input-group class="query-item" compact>
                    <a-select style="width: 40%" v-model="searchType">
                      <a-select-option :value="0">全部</a-select-option>
                      <a-select-option :value="1">会员id</a-select-option>
                      <a-select-option :value="2">会员姓名</a-select-option>
                    </a-select>
                    <a-input style="width: 60%" placeholder="请输入查询条件" v-model="keywords"/>
                  </a-input-group>
                </a-form-item>
              </a-col>
              <a-col :lg="8" :xl="6" :xxl="4">
                <div class="top-btns">
                  <a-button @click="searchList" type="primary">查询</a-button>
                  <a-button @click="resetcondition">重置</a-button>
                </div>
              </a-col>
            </a-row>
          </a-form>
          <div class="search-result-list">
            <a-table
              :columns="columns"
              :dataSource="teamProviderList"
              rowKey="id"
              :pagination="pagination"
              :loading="loading"
            >
              <!-- <span slot="action" slot-scope class="action-wrap">
                <a>查看详情</a>
              </span> -->
            </a-table>
            <pagination
              :total="total"
              @loadDataList="pageInit"
              ref="pageBand"
              class="page-pop"
            />
          </div>
        </a-collapse-panel>
      </a-collapse>
    </div>
  </div>
</template>
<script>
import { partnerMember } from '../../../../store/providerApi'
export default {
  data () {
    return {
      total: 0,
      activeKey: ['1', '2'],
      gutter: { xs: 8, sm: 16, md: 16, lg: 24, xl: 24, xxl: 48 },
      pagination: false,
      loading: false,
      enableType: 0,
      timeType: 1,
      time: [],
      searchType: 0,
      keywords: '',
      columns: [{
          dataIndex: 'index',
          title: '序号'
        },
        {
          title: '会员id',
          dataIndex: 'id'
        },
        {
          title: '会员账号',
          dataIndex: 'account'
        },
        {
          title: '账号状态',
          dataIndex: 'is_enable',
          customRender(is_enable) {
            if (is_enable === true) {
              return '开启'
            } else if (is_enable === false) {
              return '关闭'
            }
          }
        },
        {
          title: '收益',
          dataIndex: 'income'
        },
        {
          title: '邀请时间',
          dataIndex: 'created_at'
        },
        // {
        //   title: '停用时间',
        //   dataIndex: 'ww'
        // },
        // {
        //   title: '操作',
        //   scopedSlots: { customRender: 'action' }
        // }
      ],
      teamProviderData: {},
      teamProviderList: []
    }
  },
  methods: {
    pageInit (info) {
      this.loading = true
      partnerMember({
        id: this.$route.query.id,
        enable_type: this.enableType, // 0 全部 1开启 2关闭
        search_type: this.searchType,	 // 1 id 2 账号 0 全部
        name: this.keywords,
        time_type: this.timeType,
        start_time: this.start_time,	
        end_time: this.end_time,	
        page: info.page,
        num: info.pageSize
      }).then(res => {
        this.loading = false
        var array = res.data.list
        for (let i = 0; i < array.length; i++) {
          array[i]['index'] = (info.page - 1) * info.pageSize + (i + 1)
        }
        this.teamProviderData = res.data
        this.teamProviderList = array
        // 分页器总页数
        this.total = res.data.total_num
      })
    },
    // 时间改变
    dateChange({ date, start_time, end_time }) {
      this.time = date
      this.start_time = start_time
      this.end_time = end_time
      console.log(date, start_time, end_time)
    },
    // 重置
    resetcondition() {
      this.time = []
      this.level = 0
      this.timeType = 1
      this.start_time = 0
      this.end_time = 0
      this.searchType = 0
      this.keywords = ''
      this.$refs.pageBand.getData()
    },
    // 搜索
    searchList() {
      this.$refs.pageBand.getData()
    },
  }
}
</script>

<style lang="scss" scoped>
</style>
